// 封装分类数据
import {getCategoryApi} from '@/apis/category'
import {onMounted, ref} from 'vue'
import { useRoute } from 'vue-router'
import { onBeforeRouteUpdate } from 'vue-router'
export function useCategory(){
    const categoryDate = ref([])
    // vue2里的this.route   vue3用useRoure()
    const route = useRoute()
    // id没有时给个默认值，有时id对于下面的to.params.id
    const getCategory = async (id = route.params.id) => {
        const res = await getCategoryApi(id) 
        // console.log(res.data.result);
        categoryDate.value =  res.data.result
    }
    onMounted(()=>{
        getCategory()
    })
    // 目标:路由参数变化的时候 可以把分类数据接口重新发送
    // to目标路由对象
    onBeforeRouteUpdate((to) => {
        // 存在问题：使用最新的路由参数请求最新的分类数据
        getCategory(to.params.id)
        
    })

    // 导出数据
    return{
        categoryDate
    }

}